<template>
  <div class="set">
    <div class="bar">
      <div class="barLeft" @click="gooff">
        <van-icon name="arrow-left" />
      </div>
      <div class="barReft">
        <span>设置中心</span>
      </div>
    </div>
    <van-cell title="信息通知" is-link class="setty" />
    <van-cell title="播放与下载" is-link class="setty" />
    <van-cell title="检查更新" is-link class="setty" />
    <van-button round type="info" class="exit" @click="quit"
      >退出登入</van-button
    >
  </div>
</template>


<script>
export default {
  name: "set",
  data() {
    return {};
  },
  methods: {
    gooff() {
      this.$router.go(-1);
    },
    quit() {
      //1. 拿用户信息
      var userInfo = localStorage.getItem("userInfo");
      // console.log(userInfo);
      userInfo = JSON.parse(userInfo)
      // 2. 从缓存中拿出用户浏览信息，存储到数据库中 绑定用户
      var video = localStorage.getItem("video");
      video = JSON.parse(video);
      // console.log(video);
      //   2.1 缓存到数据库中
      this.$axios
        .post("/api/cart", { video:video, username:userInfo.username })
        .then((data) => {
          // console.log(data.data);
          if (data.data.code == 200) {
            // alert(data.data.msg);
            // 3. 退出清除缓存
            localStorage.removeItem("userInfo");
            localStorage.removeItem("video")
            localStorage.removeItem("lbarr")
            localStorage.removeItem("cart")
            // 跳到登入页面
            this.$router.push("/enters");
          }
        });
    },
  },
};
</script>


<style scoped>
.bar {
  display: block;
  height: 0.66rem;
  width: 100%;
  background-image: linear-gradient(
    90deg,
    rgb(26, 46, 74) 0rem,
    rgb(64, 152, 144) 100%
  );
}
.barLeft {
  float: left;
  margin-top: 0.12rem;
  width: 10%;
  height: 0.54rem;
  text-align: center;
  line-height: 0.3rem;
  font-size: 0.3rem;
  color: #fff;
}
.barReft {
  float: right;
  width: 90%;
  text-align: center;
  line-height: 0.6rem;
}
.barReft span {
  font-size: 0.2rem;
  font-weight: 700;
  color: cyan;
  display: inline-block;
  transform: translateX(-0.18rem);
}

.setty .van-cell__title {
  margin: 0.02rem 0;
}
.setty .van-cell__title span {
  font-size: 0.13rem;
}
.exit {
  width: 2rem;
  height: 0.5rem;
  margin: 0.1rem auto;
  transform: translateX(0.68rem);
}
.van-button__text {
  font-size: 20px;
}
</style>